<!DOCTYPE html>
<html lang="zh-cn" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, shrink-to-fit=no">
    <meta name="referrer" content="origin">
    <meta http-equiv="Cache-Control" content="no-transform">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <meta name="keywords" content="liujit.com"/>
    <meta name="description" content="刘军的个人博客"/>

    <title>友情链接</title>

    <div th:replace="~{common/commonJs :: topSource}"></div>
    <link type="text/css" rel="stylesheet"
          href="https://cdn.jsdelivr.net/gh/liujun0128/blog@master/static/css/page.css">

</head>
<body>
<div th:replace="common/navTool :: navTools"></div>

<a id="cover"></a>
<div id="header">
    <div class="header">
        <div class="vertical">
            <div class="inner">
                <h1 class="header-subtitle">友情链接</h1>
                <div class="header-subinfo">
                    <p class="article-info-text Chinese"></p>
                    <p class="article-info-text English"></p>
                </div>
            </div>
        </div>
        <canvas id="articleHeaderCanvas"></canvas>
    </div>
</div>

<div id="container">
    <div id="content">
        <div id="article">
            <div class="article-body">
                                <style type="text/css">
                                    .friends .friend-content .friend-card:hover .friend-left .avatar {
                                        box-shadow: 0 2px 4px 0px rgba(0, 0, 0, 0.1), 0 4px 8px 0px rgba(0, 0, 0, 0.1), 0 8px 16px 0px rgba(0, 0, 0, 0.1);
                                        transform: scale(1.2) rotate(12deg)
                                    }
                                </style>
<!--                <style type="text/css">-->
<!--                    .friends .friend-content .friend-card:hover {-->
<!--                        background: rgba(255, 87, 34, 0.15) !important-->
<!--                    }-->

<!--                    .friends .friend-content .friend-card:hover p {-->
<!--                        color: #FF5722 !important-->
<!--                    }-->

<!--                    .friends .friend-content .friend-card:hover .friend-left .avatar {-->
<!--                        box-shadow: 0 4px 8px 0px rgba(0, 0, 0, 0.1);-->
<!--                        transform: scale(1.1) translateY(-8px)-->
<!--                    }-->
<!--                </style>-->
                <div class="friends">
                    <div class="friend-head">
                        <span>特别鸣谢：</span>
                    </div>
                    <!--                    <p>备注？</p>-->
                    <div class="friend-content">
                        <a class="friend-card" target="_blank" href="https://hexo.io/">
                            <div class="friend-left">
                                <img class="avatar"
                                     src="https://cdn.jsdelivr.net/gh/liujun0128/blog@master/static/image/logo/cat.png">
                            </div>
                            <div class="friend-right">
                                <p class="friend-name">Hexo</p>
                                <div class="friend-about">
                                    <p>快速, 简单而强大的博客框架。</p>
                                </div>
                            </div>
                        </a>

                        <a class="friend-card" target="_blank" href="https://github.com/first19326/Hexo-LiveForCode">
                            <div class="friend-left">
                                <img class="avatar"
                                     src="https://cdn.jsdelivr.net/gh/first19326/hexo-liveforcode@master/static/image/sidebar/avatar.jpg">
                            </div>
                            <div class="friend-right">
                                <p class="friend-name">Live For Code</p>
                                <div class="friend-about">
                                    <p>简单地活着, 肆意又精彩。</p>
                                </div>
                            </div>
                        </a>
                    </div>
                </div>

                <div class="friends">
                    <div class="friend-head">
                        <span>友情链接：</span>
                    </div>
                    <!--                    <p>备注？</p>-->
                    <div class="friend-content">
                        <a class="friend-card" target="_blank" href="https://liujit.com/">
                            <div class="friend-left">
                                <img class="avatar"
                                     src="https://cdn.jsdelivr.net/gh/liujun0128/blog@master/static/image/logo/cat.png">
                            </div>
                            <div class="friend-right">
                                <p class="friend-name">我自己</p>
                                <div class="friend-about">
                                    <p>学如逆水行舟, 不进则退。</p>
                                </div>
                            </div>
                        </a>
                        <a class="friend-card" target="_blank" href="https://itvita.cn/">
                            <div class="friend-left">
                                <img class="avatar"
                                     src="https://cdn.jsdelivr.net/gh/liujun0128/blog@master/static/image/logo/cat.png">
                            </div>
                            <div class="friend-right">
                                <p class="friend-name">it vita</p>
                                <div class="friend-about">
                                    <p>志士惜日短, 愁人知夜长。</p>
                                </div>
                            </div>
                        </a>
                    </div>
                </div>

                <div id="notes">

                </div>
            </div>
        </div>
    </div>
</div>

<div id="footer"></div>

<div th:replace="common/menu :: menu"></div>

<script th:replace="~{common/commonJs :: config}"></script>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>

<script>
    var about = "> 欢迎各位朋友前来交换友链，本站友链接受以下类型的网站： \n" +
        "> - 个人博客\n" +
        "> - 公益组织等非盈利性网站\n" +
        "> - 不接受广告、商业性网站，特殊情况除外 \n" +
        "> - 如果你的网站 <font color='red'><u>**一个月以上无法正常访问**</u></font> 将会被移除。"
    $("#notes").html(marked(about))
</script>
</body>
</html>